<template>
  <div class="container">
    <el-table :data="indicatorInfoList" border>
      <el-table-column type="index" label="序号" width="55" />
      <el-table-column prop="tableName" label="表名称" width="100" />
      <el-table-column prop="column" label="字段" width="100" />
      <el-table-column prop="alias" label="别名" width="100">
        <template #defalut="{ row }">
          <el-input v-model="row.alias" />
        </template>
      </el-table-column>
      <el-table-column prop="indicatorName" label="标题" width="100" />
      <el-table-column prop="typeName" label="字段类型" width="100" />
      <el-table-column prop="pk" label="是否是主键" width="100" />
      <el-table-column prop="dataType" label="数据类型" width="100" />
      <el-table-column prop="size" label="数据长度" width="100" />
      <el-table-column prop="digit" label="数据精度" width="100" />
    </el-table>
  </div>
</template>
<script lang="ts">
export default { name: "ThemeTableColumnConfig" };
</script>
<script setup lang="ts">
import IndicatorThemeAPI, { IndicatorIds, IndicatorInfoListResponse } from "@/api/themeTable/index";
const props = defineProps<{
  ids: IndicatorIds;
}>();
const emits = defineEmits(["config-closed"]);
const indicatorIds = reactive<IndicatorIds>({});
const indicatorInfoList = ref<IndicatorInfoListResponse[]>();

const handlerQuery = async () => {
  const response = await IndicatorThemeAPI.IndicatorInfoList(props.ids);
  indicatorInfoList.value = response;
};

const handleClose = () => {
  emits("config-closed", indicatorInfoList.value);
};

onMounted(() => {
  handlerQuery();
});
</script>
<style lang="scss" scoped></style>
